<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>个人博客</title>
    <style>
        * {
            box-sizing: border-box;
        }

        body {
            height: 100%;
        }

        #footer {
            width: 100%;
        }

        body {
            background-color: #f8f1e7;
            padding: 10px;
        }

        .header {
            background-image: url(img/bd.jpg);
            padding: 60px;
        }

        .header h1 {
            font-size: 50px;
        }

        .topnav {

            background-color: rgb(250, 221, 189);

        }

        .topnav a {
            text-decoration: none;
            color: #0c0c0c;
            display: block;
            float: left;
            padding: 10px 5px;
        }

        .topnav a:hover {
            color: #000;
            background-color: #d6bfbf;
        }


        #person {
            border: 1px solid #d6bfbf;
            width: 20%;
            float: left;
            height: 700px;
            padding: 10px;
        }

        #work {
            width: 80%;
            float: left;
            padding: 10px;
        }

        #person_1 {
            border: 1px solid #d6bfbf;
            background-color: #f8f1e7;
            text-align: center;
            width: 100%;
            height: 30px;
        }


        #work_1 {
            border: 1px solid #d6bfbf;
            background-color: #f8f1e7;
            text-align: center;
            width: 100%;
            height: 30px;
        }

        #bowen_1 {
            border: 1px solid #d6bfbf;
            background-color: #f8f1e7;
            text-align: left;
        }

        #bowen_2 {
            border: 1px solid #d6bfbf;
            background-color: #f8f1e7;
            text-align: left;
        }

        #bowen_3 {
            border: 1px solid #d6bfbf;
            background-color: #f8f1e7;
            text-align: left;
        }

        #footer {
            background-color: #f8f1e7;
            float: left;
            height: 50px;
        }

        @media all and (max-width:768px) {
            #work,
            #person {
                float: none;
                width: 100%;
            }
        }
    </style>

</head>

<body>
    <div class="header">
        <h2>MENG_2019的博客</h2>
        <p><a href="https://user.qzone.qq.com">https://user.qzone.qq.com</a></p>
        <a href=""></a>

        <div class="topnav">
            <a href="#" style=font-size:15px;>首页</a>
            <a href="#" style=font-size:15px;>|</a>
            <a href="#" style=font-size:15px;>博文目录</a>
            <a href="#" style=font-size:15px;>|</a>
            <a href="#" style=font-size:15px;>关于我</a>
            <a href="#" style=font-size:15px;>|</a>
            <a href="#" style=font-size:15px;>退出</a>
        </div>
    </div>



    <div class="row">
        <div id="person">
            <div id="person_1" style=font-size:15px;>个人资料 &nbsp;
            </div>
            <hr>
            <div id="person_2">
                <div id="ig" align="center"><img src="img/qq.png" alt="图片加载失败"></div>
                <div id="gongneng">
                    <a href="#" style=font-size:15px;>加好友</a>
                    <a href="#" style=font-size:15px;>发纸条</a>
                    <a href="#" style=font-size:15px;>写留言</a>
                    <a href="#" style=font-size:15px;>加关注</a>
                </div>
            </div>
            <hr>

            <div id="re">
                <div id="re_1" style=font-size:15px;>热门文章
                    <div id="re_3">
                        <hr>
                    </div>
                </div>
                <div id="re_2" style=font-size:15px;>上官婉儿大招分为五段攻击，每段攻击之间都有4秒左右的间隔时间，超过这个时间大招就会中断。</div>
                <hr>
                <div id="re_4" style=font-size:15px;>断大的上官婉儿还比不上露娜，简直就是超级兵的存在，被人近身就毫无反抗之力</div>
            </div>


        </div>
        <div id="work">
            <div id="work_1" style=font-size:15px;>博文
                <hr>
                <div id="bowen_1">
                    <h3>吴秀波方否认复出</h3>
                    <span>2019-8-29</span><br>
                    <span><img src="img/qq.png" alt="图片加载失败"></span>
                    <p>2018年9月24日，女演员陈昱霖朋友圈发长文称，自己和已婚男演员吴秀波相恋七年。2019年1月18日，演员陈昱霖的父母发表公开信，称女儿陈昱霖去年曝光与吴秀波有染后，吴秀波方报案，以涉嫌敲诈勒索罪起诉陈昱霖，陈昱霖目前被关押在看守所。
                    </p>
                </div>
                <div id="bowen_2">
                    <h3>美国阿肯枪击</h3>
                    <span>2019-8-29</span><br>
                    <span><img src="img/qq.png" alt="图片加载失败"></span>
                    <p>2018年9月24日，女演员陈昱霖朋友圈发长文称，自己和已婚男演员吴秀波相恋七年。同时还爆料称吴秀波同时还出轨合2018年9月25日，有消息称吴秀波将退出录制综艺节目《我就是演员》，被《我就是演员》的总导演吴彤否认。2019年1月18日，演员陈昱霖的父母发表公开信，称女儿陈昱霖去年曝光与吴秀波有染后，吴秀波方报案，以涉嫌敲诈勒索罪起诉陈昱霖，陈昱霖目前被关押在看守所。
                    </p>

                </div>
                <div id="footer" style=font-size:15px; align="center" ;>
                    <p>
                        <p class="copyright SG_linka"> Copyright © 2019-8-28 by doumenghan
                        </p>
                </div>
            </div>
            <div id="work_2"></div>
        </div>
    </div>



</body>

</html>